<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div class="box">
      <pre>
         select如果加了 multiple="multiple"在数据模板中（data）就需要是一个数组   
        </pre
      >
      <form action="">
        <label for="female">男</label>
        <input type="radio" id="female" value="男" v-model="sex" />
        <label for="woman">女</label>
        <input type="radio" id="woman" value="女" v-model="sex" />
        <br />
        <select name="" id="opts" v-model="opts" multiple="multiple">
          <!-- multiple="multiple" -->
          <option value="one">one</option>
          <option value="two">two</option>
          <option value="three">three</option>
        </select>
        <br />
        <textarea
          name=""
          id=""
          cols="30"
          rows="90"
          v-model="textarea"
        ></textarea>
        <button @click.prevent="get">单击</button>
      </form>
    </div>
    <script src="../node_modules/vue/dist/vue.js"></script>
    <script>
      new Vue({
        el: '.box',
        data: {
          sex: '',
          opts: [],
          textarea: '',
        },
        methods: {
          get() {
            console.log(this.sex)
            console.log(this.opts[2])
            console.log(this.textarea)
          },
        },
      })
    </script>
  </body>
</html>
